@extends('layouts.header')
@section('title',$name_site)
@section('style')
    #logotext:focus {
    /* cursor: default; */
    color: #fff;
    }

    .Hui-aside ul {
    background-color: #fff;
    }

    .Hui-aside dt:hover {
    color: #000 !important;
    /* font-weight:bold; */
    font-size: 15px;
    }

    /* .Hui-article {
    top: 0px;
    } */
    .icon-fullscreen, .icon-fullscreen-exit {
    font-size: 30px !important;
    margin-left: 15px;
    cursor: pointer;
    }

    #Hui-userbar {
    right: 80px;
    }

    @media (min-width: 767px) {
    .Hui-article {
    top: 0px;
    }
    }

    .Hui-aside .menu_dropdown dl:last-child dd {
    border-bottom: 40px solid #eee !important;
    }

    .Hui-aside .menu_dropdown dl dd ul li.active a {
    border-left: 5px solid #5a98de;
    padding-left: 21px;
    /* border-right: 1px solid #19aa8d;
    border-top: 1px solid #19aa8d;
    border-bottom: 1px solid #19aa8d; */
    background: #F5FAFE;
    }

    .Hui-aside .menu_dropdown dl dd ul li a:hover {
    border-left: 5px solid #BCD8F2;
    padding-left: 21px;
    background: #F5FAFE;
    }

    .luntan {
    line-height: 44px;
    color: #fff;
    text-decoration: none;
    }

    .luntan:hover {
    color: #FFCC17;
    text-decoration: none;
    }

    .luntan:visited {
    color: #fff;
    }

    .fankui {
    line-height: 44px;
    color: #fff;
    text-decoration: none;
    }

    .fankui:hover {
    color: #FFCC17;
    text-decoration: none;
    }

    .fankui:visited {
    color: #fff;
    }

    .luntan i {
    color: #FFCC17;
    font-size: 16px;
    margin-right: 5px;
    }

    @media (max-width: 767px) {
    .fankui {
    margin-right: 70px;
    }
    }

    #Hui-userbar {
    position: static;
    }

    @media (max-width: 345px) {
    .hidden-xxs { display: none; }
    }
@endsection
@section('content')
    <header class="navbar-wrapper">
        <div class="navbar navbar-fixed-top">
            <div class="container-fluid cl">
                <a class="logo navbar-logo f-l mr-10 hidden-xs" id="logotext" href="javascript:;" title="首页"
                   onclick="iframe_src('/{{config('constant.name_admin')}}/index/welcome');$('.Hui-aside .menu_dropdown dl dd ul li').removeClass('active');">
                    {{ $name_site }}
                    @if (config('constant.is_profession_ver'))
                        [专业版]
                    @else
                        [标准版]
                    @endif
                </a>
                <a class="logo navbar-logo-m f-l mr-10 visible-xs" href="javascript:void(0)">安全工器具 【{{ auth('admin')->user()->username }}】</a>
                <span class="logo navbar-slogan f-l mr-10 hidden-xs"></span>
                <a aria-hidden="false" class="nav-toggle Hui-iconfont visible-xs" href="javascript:;">&#xe667;</a>
                <nav id="Hui-userbar" class="nav navbar-nav navbar-userbar hidden-xs f-r">
                    <ul class="cl">
                        <li class="dropDown dropDown_hover">
                            <a href="javascript:void(0)" class="dropDown_A"><i class="Hui-iconfont">&#xe62d;</i>&nbsp;&nbsp;<span id="username">{{ auth('admin')->user()->username }}</span> <i class="Hui-iconfont">&#xe6d5;</i></a>
                            <ul class="dropDown-menu menu radius box-shadow">
                                <li><a href="javascript:;" onClick="myselfinfo('编辑个人信息','/{{config('constant.name_admin')}}/manager/editself','','')">个人信息</a></li>
                                <li><a href="javascript:;" onClick="myselfinfo('修改密码','/{{config('constant.name_admin')}}/manager/editpassself','363','380')">修改密码</a></li>
                                <li><a href="/{{config('constant.name_admin')}}/public/logout">退出</a></li>
                            </ul>
                        </li>
                        <li>
                            @if (auth('admin')->user()->role)
                                【{{ auth('admin')->user()->role->role_name }}】
                            @else
                                【无角色】
                            @endif
                        </li>
                    </ul>
                </nav>
                <a class="luntan f-r mr-15 hidden-xs" href="http://bbs.hbjc2018.cn" target="_blank"><i class="Hui-iconfont Hui-iconfont-xiaoxi1"></i>论坛</a>
                <a class="fankui f-r mr-15 hidden-xs" href="https://support.qq.com/product/167343" target="_blank">反馈</a>
                <a class="fankui f-r mr-15 hidden-xs" href="/view.htm" target="_blank">更新记录</a>
                @if(count($roles) > 1)
                    <a class="fankui f-r mr-15 hidden-xxs">
                        <select name="role_oid" id="role_oid" class="input-text" style="width: 80px;" >
                            <option value="">⇋角色</option>
                            @foreach($roles as $val)
                                <option @if ($val->id == auth('admin')->user()->role_id) hidden @endif  value="{{$val -> id}}">{{ $val->role_name }}</option>
                            @endforeach
                        </select>
                    </a>
                @endif
            </div>
        </div>
    </header>
    <aside class="Hui-aside">
        <div class="menu_dropdown bk_2">
            @foreach ($auth_A as $v)
                <dl>
                    <dt>
                        <i class="Hui-iconfont Hui-iconfont-fenlei"></i> {{ $v->auth_name }}<i class="Hui-iconfont menu_dropdown-arrow">&#xe6d5;</i>
                    </dt>
                    <dd>
                        <ul>
                            @foreach ($auth_B as $vv)
                                @if ($vv->pid==$v->id)
                                    <li onclick="removeSup('{{$vv->id}}')">
                                        <a href="javascript:;" onclick="iframe_src('{{asset($vv->url)}}');">{{ $vv->auth_name }}
                                            <sup class="Hui-iconfont @if($vv->sub_topic !== '/'.domain().'/sample_info/submit/count' || cache('sample_submit_noread_count',0) === 0) hidden @endif c-red" id="aside_{{$vv->id}}"> &#xe6c4; </sup>
                                        </a>
                                    </li>
                                @endif
                            @endforeach
                        </ul>
                    </dd>
                </dl>
            @endforeach
            <dl>
                <dt>
                    <i class="Hui-iconfont Hui-iconfont-fenlei"></i> 个人中心<i class="Hui-iconfont menu_dropdown-arrow">&#xe6d5;</i>
                </dt>
                <dd>
                    <ul>
                        {{-- <li><a href="javascript:;" onclick="iframe_src('{{asset($vv->url)}}');">{{ $vv->auth_name }}</a></li> --}}
                        <li><a href="javascript:;" onClick="myselfinfo('编辑个人信息','/{{config('constant.name_admin')}}/manager/editself','','')">个人信息</a></li>
                        <li><a href="javascript:;" onClick="myselfinfo('修改密码','/{{config('constant.name_admin')}}/manager/editpassself','363','380')">修改密码</a></li>
                        <li><a href="/{{config('constant.name_admin')}}/public/logout">退出</a></li>
                    </ul>
                </dd>
            </dl>

            {{-- <dl>
                <dt>
                    <i class="Hui-iconfont">&#xe616;</i> 检测业务<i class="Hui-iconfont menu_dropdown-arrow">&#xe6d5;</i>
                </dt>
                <dd>
                    <ul>
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/contract/addShow');">新建批次</a></li>
                        {{ -- <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/contract/index');">批次列表</a></li> -- }}
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/contract/indexAll');">批次查看</a></li>
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/contract/indexInfoLuru');">信息录入</a></li>
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/contract/indexPrintBarCode');">打印条形码</a></li>
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/contract/indexAssignTask');">任务分配</a></li>
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/contract/indexResLuru');">结果录入</a></li>
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/contract/indexCheck');">审核报告</a></li>
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/contract/indexApprove');">批准报告</a></li>
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/contract/indexDownloadReport');">下载报告</a></li>
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/contract/indexPrintPassedCard');">打印合格证</a></li>
                    </ul>
                </dd>
            </dl> --}}
            {{-- <dl>
                <dt><i class="Hui-iconfont">&#xe613;</i> 基础信息<i class="Hui-iconfont menu_dropdown-arrow">&#xe6d5;</i></dt>
                <dd>
                    <ul>
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/client/index');">客户信息</a></li>
                    </ul>
                </dd>
            </dl>
            <dl id="menu-admin">
                <dt><i class="Hui-iconfont">&#xe62d;</i> 管理员管理<i class="Hui-iconfont menu_dropdown-arrow">&#xe6d5;</i></dt>
                <dd>
                    <ul>
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/role/index');">角色查看</a></li>
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/auth/index');">权限查看</a></li>
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/manager/index');">管理员查看</a></li>
                    </ul>
                </dd>
            </dl>
            <dl id="menu-system">
                <dt><i class="Hui-iconfont">&#xe62e;</i> 系统管理<i class="Hui-iconfont menu_dropdown-arrow">&#xe6d5;</i></dt>
                <dd>
                    <ul>
                        <li><a href="javascript:;" onclick="iframe_src('/{{config('constant.name_admin')}}/sampleBasicInfo/index');">标准展示</a></li>
                        <li><a href="http://www.h-ui.net/Hui-overview.shtml" target="_blank">Hui框架官网</a></li>
                    </ul>
                </dd>
            </dl> --}}
        </div>
    </aside>
    <div class="dislpayArrow hidden-xs"><a class="pngfix" href="javascript:void(0);" onClick="displaynavbar(this)"></a></div>
    <section class="Hui-article-box">
        {{-- <div id="Hui-tabNav" class="Hui-tabNav hidden-xs">
            <div class="Hui-tabNav-wp">
                <ul id="min_title_list" class="acrossTab cl">
                    <li class="active">
                        <span title="首页" data-href="/{{config('constant.name_admin')}}/index/welcome">首页</span>
                        <em></em></li>
                </ul>
            </div>
            <div class="Hui-tabNav-more btn-group"><a id="js-tabNav-prev" class="btn radius btn-default size-S" href="javascript:;"><i class="Hui-iconfont">&#xe6d4;</i></a>
                <a id="js-tabNav-next" class="btn radius btn-default size-S" href="javascript:;"><i class="Hui-iconfont">&#xe6d7;</i></a>
            </div>
        </div> --}}
        <div id="iframe_box" class="Hui-article">
            <div class="show_iframe">
                <div class="loading" id="loading" style="display:none"></div>
                <iframe scrolling="yes" frameborder="0" src="{{ $default_page }}" id="myiframe"></iframe>
            </div>
        </div>
    </section>

    <div class="contextMenu" id="Huiadminmenu">
        <ul>
            <li id="closethis">关闭当前</li>
            <li id="closeall">关闭全部</li>
        </ul>
    </div>
    <!--请在下方写此页面业务相关的脚本-->
    <script type="text/javascript" src="/admin/lib/jquery.contextmenu/jquery.contextmenu.r2.js"></script>
    <script src="/admin/lib/mqtt.min.js"></script> <!-- 引处MQTT.MINI.JS库文件 -->
    <script type="text/javascript">
        var mqttClient, subTopics = @json($subTopics), subTopicIdObj = new Array();
        $(function () {
            // alert($(window).width());
            //点击栏目后，左边加条竖线标志
            $(".Hui-aside .menu_dropdown dl dd ul li").click(function () {
                $(".Hui-aside .menu_dropdown dl dd ul li").removeClass("active");
                $(this).addClass("active");
            });

            $(".Hui-aside .menu_dropdown dl:first dd").slideDown(0);//默认让第一个栏目展开

            $(".icon-fullscreen").click(function () {
                fullScreen();
                $(this).hide();
                $(".icon-fullscreen-exit").show();
            });

            $(".icon-fullscreen-exit").click(function () {
                exitFullScreen();
                $(this).hide();
                $(".icon-fullscreen").show();
            });

            //注册iframe加载完成后的事件
            $("#myiframe").on('load', function () {
                $('#loading').hide();
                $(this).show();
            });
            /*$("#min_title_list li").contextMenu('Huiadminmenu', {
                bindings: {
                    'closethis': function(t) {
                        console.log(t);
                        if(t.find("i")){
                            t.find("i").trigger("click");
                        }
                    },
                    'closeall': function(t) {
                        alert('Trigger was '+t.id+'\nAction was Email');
                    },
                }
            });*/

            /* 通知服务器保存登录日志 */
            /* $.ajax({
                type: 'GET',
                url: '/{{config('constant.name_admin')}}/myapi/loginLog',
                // dataType: 'json',
                success: function(data){
                },
            });	 */

            @if(!config('constant.is_lan'))
            //连接
            try{
                console.log(subTopics);
                for (let id in subTopics) {
                    subTopicIdObj[subTopics[id]] = id;
                }
                mqttConnect();
            }catch(err){
                console.log(err);
            }
            @endif

        });

        /*
        * 浏览器全屏
        */
        function fullScreen() {
            var el = document.documentElement;
            var rfs = el.requestFullScreen || el.webkitRequestFullScreen;
            if (typeof rfs != "undefined" && rfs) {
                rfs.call(el);
            } else if (typeof window.ActiveXObject != "undefined") {
                var wscript = new ActiveXObject("WScript.Shell");
                if (wscript != null) {
                    wscript.SendKeys("{F11}");
                }
            } else if (el.msRequestFullscreen) {
                el.msRequestFullscreen();
            } else if (el.oRequestFullscreen) {
                el.oRequestFullscreen();
            } else {
                //360 的IE兼容模式、FireFox不支持
                layer.msg('您的浏览器不支持此功能，请按【F11】全屏', {time: 2000});
            }
        }

        /*
            * 浏览器退出全屏
            */
        function exitFullScreen() {
            var el = document;
            var cfs = el.cancelFullScreen || el.webkitCancelFullScreen || el.exitFullScreen;
            if (typeof cfs != "undefined" && cfs) {
                cfs.call(el);
            } else if (typeof window.ActiveXObject != "undefined") {
                var wscript = new ActiveXObject("WScript.Shell");
                if (wscript != null) {
                    wscript.SendKeys("{F11}");
                }
            } else if (el.msExitFullscreen) {
                el.msExitFullscreen();
            } else if (el.oRequestFullscreen) {
                el.oCancelFullScreen();
            } else {
                //360 的IE兼容模式、FireFox不支持
                layer.msg('您的浏览器不支持此功能，请按【F11】退出全屏', {time: 2000});
            }
        }

        /*个人信息*/
        function myselfinfo(title, url, w, h) {
            layer_show(title, url, w, h);
        }

        /*更新顶部的用户名*/
        function update_username(name) {
            $('#username').text(name);
        }

        function iframe_src(str_src) {
            $('#myiframe').hide();
            $('#loading').show();
            document.getElementById('myiframe').src = str_src;
            //  $('#myiframe').attr('src',str_src);

        }

        // ================================= 以下为百度商桥代码 =========

        /* var _hmt = _hmt || [];
         (function() {
           var hm = document.createElement("script");
           hm.src = "https://hm.baidu.com/hm.js?3f4ed26df89e4598a947457983bf3dad";
           var s = document.getElementsByTagName("script")[0];
           s.parentNode.insertBefore(hm, s);
         })();*/

        $('#role_oid').on('change', function () {
            var index2;
            $.ajax({
                type: 'post',
                url: '/{{config('constant.name_admin')}}/manager/changeRole/' + $(this).val(),
                headers: {'X-CSRF-TOKEN': "{{ csrf_token() }}"},
                success: function (data) {
                    if (data > 0) {
                        location.reload();
                    } else {
                        layer.msg('切换失败！');
                    }
                },
                error: function (data) {
                    ajax_error(data);
                },
                beforeSend: function () {
                    //0.4透明度 白色遮罩
                    index2 = layer.load(2, {shade: [0.05, '#000']});
                },
                complete: function () {
                    layer.close(index2);
                },
            })
        })

        //连接
        function mqttConnect() {
            // Create a client instance
            var options = {
                //mqtt客户端的id，这里面应该还可以加上其他参数，具体看官方文档
                clientId: 'mqttjs_'+ location.host  + '{{request()->getClientIp().uniqid().rand(100000,999999)}}',
                username: 'sample_sub_user',
                password: 'sample_sub_user',
                connectTimeout: 4000,
                clean: true,
            };
            //浏览器采用websocket协议，host主机地址为192.168.0.200，端口为9001，路径为/mqtt
            console.log(location.host);
            mqttClient = mqtt.connect("ws://" + location.host + ":8831", options) // you add a ws:// url here
            //建立连接
            mqttClient.on('connect', function () {
                // console.log("connect success!")
                //订阅主题 presence
                console.log(subTopics);
                for (let id in subTopics) {
                    mqttClient.subscribe(subTopics[id], function (err) {
                        console.log(err);
                        if (!err) {
                            // console.log(subTopics[id] + "subscribe success!")
                        } else {
                            console.log(err)
                        }
                    })
                }
            })

            //如果client订阅主题成功，那么这里就是当接收到自己订阅主题的处理逻辑
            mqttClient.on('message', function (topic, message) {
                console.log(topic + '-> ' + message)
                // message is Buffer,此处就是打印消息的具体内容
                let id = subTopicIdObj[topic];
                // console.log(id)
                parseInt(message) === 0 ? $('#aside_' + id).addClass('hidden') : $('#aside_' + id).removeClass('hidden');
            })
            mqttClient.on('error', function (error) {
               console.log(error)
            })
        }

        //点击去掉sup标
        function removeSup(id) {
            $('#aside_' + id).addClass('hidden');
        }

        $('#ceshi').on('click',function () {
            // body...
            console.log(12111111111);
            // ajax('get', 'http://192.168.8.114:9001/app/TestConnect', {'id':1}, ajaxBak,0,0);
            ajax('get', 'http://www.0531yun.cn/wsjc/app/TestConnect', {'id':'1'}, ajaxBak,0,0);
            function ajaxBak(res){
                console.log(res);
            }
        })
    </script>
@endsection